<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue js</title>
    <style>
        .completed {
            text-decoration: line-through;
        }

        .something {
            color: red;
        }
    </style>
</head>

<body>
<script src="../js/vue.min.js"></script>
<script src="../js/vue-resource.js"></script>
<div class="container">
    <div id="app">
        <ul>
            <li v-for="list in tasks">
                {{ list.id }} - {{ list.author }} - {{ list.name }} - {{ list.price }}
            </li>
        </ul>
    </div>
</div>

<script>
    var tokenVal = "sdfgdfgdfgdfgsss";
    Vue.http.options.emulateJSON = true;//将提交的数据类型又request payload转换成form data
    //    拦截器是全局变量
    Vue.http.interceptors.push(function (request, next) {
        console.log("a1");
        console.log("a2");
//        设置请求头
        request.headers.set('Authorization', 'sdfsdfsdfsdf')
        // console.log(request)
        next(function (response) {
            console.log(response)
        })
    });
    //    将header中插入token
        Vue.http.headers.common['token'] = tokenVal;

    var demo = new Vue({
        el: '#app',
        data: {
            tasks: '' //为空，可以是null
        },
        mounted: function () {
            this.getCustomers();
            this.postData();
        },
        methods: {
            getCustomers: function () {
                this.$http.get('book.json')
                        .then(function (response) { //response传参，可以是任何值
                            this.tasks=response.data
//                            console.log(response);
                        })
                        .catch(function (response) {
//                            console.log(response)
                        })
            },
            postData: function () {

                this.$http.post('./postdata.php?id=a12', {message: 'abc123'})
                        .then(function (response) { //response传参，可以是任何值
                            console.log(response.data);
                        })
                        .catch(function (response) {
                            console.log(response)
                        })
            }
        }
    })
</script>
</body>

</html>

